.auction-index {
	// background-color: #F5F5F5;
	font-family: PingFang_Medium;
	
	// 背景图片
	.image-bg {
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: -1;
	}

	.advertising {
		// background-color: #FFFFFF;
		padding: 10px 18px 20px 18px;

		.swiper {}

		.notice {
			margin: 10px 0;
		}

		.tips {
			background-image: linear-gradient(to right, #FCEBD9, #FAD1AE);
			padding: 12px 10px 12px 20px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-radius: 10px;
			color: #CB8F58;

			.left-content {
				display: flex;
				align-items: center;

				.left-image {
					width: 9vw;
					height: 48rpx;
				}

				.left-detail {
					margin-left: 13px;
					font-size: 3.8vw;
					font-weight: 600;
				}
			}

			.right-content {
				display: flex;
				align-items: center;
				cursor: pointer;

				.right-image {
					width: 1.5vw;
					height: auto;
				}

				.right-detail {
					margin-right: 10px;
					font-size: 2.8vw;
				}
			}
		}
	}

	.auction {
		position: relative;
		margin-top: 10px;
		// background-color: #FFFFFF;
		padding: 15px 12px 15px 12px;
		
		.auction-title {
			padding: 10px;
			text-align: center;
			margin-bottom: 2vh;
			font-size: 36rpx;
			font-weight: 600;
			background-image: linear-gradient(to right, #FAD1AE, #FCEBD9);
			border-radius: 5px;
		}
		
		.auto-order-tips {
			font-size: 28rpx;
		}

		.acution-content {
			position: relative;
			box-sizing: border-box;
			margin-bottom: 18px;
			// top: 10px;
			height: 58vw;
			cursor: pointer;

			.auction-background {
				position: absolute;
				width: 100%;
				height: 100%;
				border-radius: 20px;
				z-index: 0;
			}

			// background-image: url('~@/static/home/poster_demo.png');
			// background-repeat: no-repeat;
			// background-size: 100% 100%;

			.index {
				position: absolute;
				z-index: 1;
				right: 0;
				width: 18vw;
				height: 8vw;

				.index-background {
					position: absolute;
					right: 0;
					width: 18vw;
					height: 100%;
				}

				.index-title {
					position: relative;
					top: 50%;
					transform: translateY(-55%);
					z-index: inherit;
					color: #FFFFFF;
					font-size: 40rpx;
					text-align: center;
				}
			}

			.time {
				width: 80%;
				margin: 0 auto;
				padding: 3px 20px;
				position: absolute;
				z-index: 1;
				left: 0;
				right: 0;
				bottom: 5px;
				background-color: rgba(255, 255, 255, 0.5);
				box-shadow: 0px 0px 10px 2px #FFFFFF;
				text-align: center;
				border-radius: 10px;
			
				.time-detail {
					font-size: 3.8vw;
					// font-weight: 600;
				}
			}
		}
		
		.button-group {
			display: flex;
			align-items: center;
			justify-content: center;
			
			.button {
				width: 23vw;
				line-height: 58rpx;
				text-align: center;
				font-size: 30rpx;
				// font-weight: 600;
				color: #a6a6a6;
				font-family: PingFang_Bold;
				cursor: pointer;
				
				&:nth-of-type(1) {
					margin-right: 10rpx;
				}
				
				&:nth-of-type(2) {
					margin-left: 10rpx;
				}
			}
			
			.active {
				background-color: #F5F5F5;
				color: #000000;
			}
		}
		
		.auction-content-two {
			margin: 40rpx 0;
			
			.index {
				position: absolute;
				z-index: 1;
				right: 12px;
				width: 18vw;
				height: 50rpx;
							
				.index-background {
					position: absolute;
					right: 0;
					width: 18vw;
					height: 100%;
				}
							
				.index-title {
					position: relative;
					top: 50%;
					transform: translateY(-55%);
					z-index: inherit;
					color: #F64444;
					font-size: 14px;
					text-align: center;
					line-height: 50rpx;
				}
			}
			
			.auction-item {
				padding: 55rpx 25rpx;
				box-sizing: border-box;
				box-shadow: 0px 2px 5px #dedede;
				display: flex;
				align-items: center;
				justify-content: space-between;
				
				.left {
					display: flex;
					align-items: center;
					
					.img {
						width: 11vw;
						height: 11vw;
					}
					
					.content-text {
						margin-left: 20rpx;
						
						.time-count-style {
							display: flex;
							align-items: center;
						
							.time-title {
								font-size: 30rpx;
								font-family: PingFang_Bold;
								// font-weight: 600;
							}
							
							.count-down {
								margin-left: 20rpx;
							}
						}
						
						.date-time {
							margin-top: 10rpx;
							color: #a6a6a6;
							font-size: 24rpx;
						}
					}
				}
				
				.order-button {
					width: 15vw;
					text-align: center;
					background-color: #FFE0BB;
					padding: 6px 10px;
					font-size: 26rpx;
					border-radius: 5px;
					// cursor: pointer;
				}
				
				.order-button-one {
					width: 15vw;
					text-align: center;
					background-color: #F5F5F5;
					padding: 6px 10px;
					font-size: 26rpx;
					border-radius: 5px;
					// cursor: pointer;
				}
				
				.order-button-two {
					width: 15vw;
					text-align: center;
					color: #FFFFFF;
					background-color: #5388F7;
					padding: 6px 10px;
					font-size: 26rpx;
					border-radius: 5px;
					// cursor: pointer;
				}
				
				.order-button-three {
					width: 15vw;
					text-align: center;
					color: #FFFFFF;
					background-color: #049C44;
					padding: 6px 10px;
					font-size: 26rpx;
					border-radius: 5px;
					// cursor: pointer;
				}
			}
		}
	}
	
	.auto-order-button {
		margin: 40rpx 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		
		.auto-title-switch {
			display: flex;
			align-items: center;
			padding: 20rpx 30rpx;
			box-sizing: border-box;
			box-shadow: 0px 2px 5px #dedede;
			border-radius: 5px;
			
			.auto-title {
				// background-color: #AD4440;
				margin-right: 20rpx;
				// padding: 10rpx 20rpx;
				// color: #F64444;
				font-size: 30rpx;
				font-family: PingFang_Bold;
				// font-weight: 600;
				// border-radius: 5px;
			}
		}
		
		.auto-button {
			background-color: #F64444;
			color: #FFFFFF;
			padding: 10rpx 20rpx;
			border-radius: 5px;
			font-size: 24rpx;
		}
		
		.auto-buy {
			background-color: #F64444;
			border-radius: 5px;
			
			.button {
				color: #FFFFFF;
				padding: 10rpx 20rpx;
				font-size: 28rpx;
			}
		}
	}
	
	.auto-background {
		// height: 62vh;
		padding-bottom: 40rpx;
		
		.auto-title {
			margin: 40rpx 0;
			text-align: center;
			font-size: 34rpx;
			// font-weight: 600;
			font-family: PingFang_Bold;
		}
		
		.auto-manage {
			// position: relative;
			// right: 20rpx;
			text-align: center;
			margin: 0 0 0 40rpx;
			width: 20vw;
			box-sizing: border-box;
			background-color: #F64444;
			border-radius: 5px;
			// box-shadow: 0px 2px 5px #dedede;
			
			.button-style {
				padding: 10rpx 14rpx;
				color: #FFFFFF;
				font-size: 24rpx;
				// cursor: pointer;
			}
		}
		
		.button-group {
			background-color: #FFFFFF;
			padding: 0 15px;
			// margin: 18px 3px;
			// box-shadow: 0px 2px 5px #dedede;
			
			.content {
				
				.null-text {
					margin: 30rpx 0;
					text-align: center;
					color: #686868;
				}
				
				.button {
					padding: 30rpx 0 30rpx 15rpx;
					box-sizing: border-box;
					display: flex;
					align-items: center;
					justify-content: space-between;
					
					.left {
						display: flex;
						align-items: center;
						
						.content-text {
							
							
							.date-title {
								font-size: 17px;
								// font-weight: 600;
								font-family: PingFang_Bold;
							}
							
							.date-tips {
								margin-top: 10rpx;
								color: #686868;
								font-size: 13px;
							}
						}
					}
					
					.right {
						
						.in {
							width: 3.7vw;
							height: 3.7vw;
						}
					}
				}
			}
		}
		
		.tips-content {
			margin: 40rpx 0;
			padding: 0 15px;
			color: #F64444;
			font-size: 26rpx;
			
			.tips {
				// margin-bottom: 10rpx;
				line-height: 42rpx;
			}
		}
		
		.confirm-button {
			background-color: #FCEBD9;
			margin: 40px 15px 0 15px;
			padding: 24rpx 0;
			text-align: center;
			font-size: 30rpx;
			border-radius: 5px;
			// cursor: pointer;
		}
	}
}